<template>
    <a :href="webUrl">
        <img :src="require('@/assets/svg/zh.svg')" v-if="lang == 'en'" @click.prevent="changeLang('zh')"
            style="cursor: pointer" />
        <img :src="require('@/assets/svg/en.svg')" v-if="lang == 'zh'" @click.prevent="changeLang('en')"
            style="cursor: pointer" />
    </a>
</template>

<script>
export default {
    name: 'Language',

    data() {
        return {
            lang: this.$i18n.locale
        }
    },

    computed: {
        webUrl() {
            return this.$i18n.locale == 'en' ? "/zh" + this.$route.fullPath : this.$route.fullPath
        }
    },

    methods: {
        // 切换语言
        changeLang(lang) {
            this.lang = (this.lang === 'en' ? 'zh' : 'en')
            this.$i18n.locale = this.lang; // 设置当前语言
            let url = this.$route.fullPath
            url = url.includes('/zh') ? url.replace('/zh', '') : '/zh' + url
            url = url.replace('null', '')
            // location.href = url
            this.$router.replace(url)
            // console.log('changeLang this.$i18n.locale', this.$i18n.locale)
            
        }
    },
};
</script>

<style lang="scss" scoped>
a:hover{
    background: none!important;
}
img {
    vertical-align: middle;
}
</style>